<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图片（相册）展示设计Ⅲ</title>
    <link rel="stylesheet" href="./style.css">
</head>
<body>
<!-- 三个演示图片，可自行调整需要的 -->
<figure class="sample">
  <img src="https://source.unsplash.com/75bVBhQ7NDA" alt="sample1"/>
  <figcaption>
    <h3>NO.1</h3>
    <p>I have had my invitation to this world's festival, and thus my life has been blesses.</p>
  </figcaption><i class="ion-ios-home-outline"></i>
  <a href="#"></a>
</figure>

<figure class="sample hover">
  <img src="https://source.unsplash.com/60XLoOgwkfA" alt="sample2"/>
  <figcaption>
    <h3>NO.2</h3>
    <P>I'm killing time while I wait for life to shower me with meaning and happiness.</P>
  </figcaption><i class="ion-ios-personadd-outline"></i>
  <a href="#"></a>
</figure>

<figure class="sample">
  <img src="https://source.unsplash.com/MCMfw-bl8lY" alt="sample3"/>
  <figcaption>
    <h3>NO.3</h3>
    <p>I just wish someday and somehow, we can be back together, together we'll stay, always and forever.</p>
  </figcaption><i class="ion-ios-location-outline"></i>
  <a href="#"></a>
</figure>
<!-- partial -->
  <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js'></script><script src="./script.js"></script>
</body>
</html>